{% load set_var %}

<div id="gridContainer" >
{% for column in columns %}
	<div id="gridColumn" >
		{% for album in column %}
			{% set heightInfo = album.firstPhoto.miniHeight - 22 %}
			<div class="gridElementAlbum" style="height :{{album.firstPhoto.miniHeight}}px;" id="album{{album.id}}">
				<div class="gridPhotoAlbum" width="170" height="{{album.firstPhoto.miniHeight}}">
					<img src="/media/{{album.firstPhoto.urlThumb}}" style="width:170px; height:{{album.firstPhoto.miniHeight}}px;" alt="{{album.firstPhoto.title}}" />
					<img src="/media/img/editPhoto.png" style="float:left; padding:5px; background-image : url(/media/images/bgComments.png);" />
				</div>
				<div class="gridInfoAlbum">
					<div class="whiteBorderAlbum" style=" height:{{album.firstPhoto.miniHeight}}px" ></div>
					<div class="infoBoxAlbum" style="top:{{heightInfo}}px;">
						<span class="infoTextStyleAlbum" style="font-weight:bold !important;">
							<strong><img src="/media/images/dossierIco.png" style="margin-right:5px;" />{{album.nom}}</strong> 
						</span>
					</div>
				</div>
				
			</div>
		{% endfor %}
	</div>
{% endfor %}
	<div style="clear:both;"></div>
	<div id="paginagtion" style="width : 1000px; text-align:center;">
		{% for i in nbPages %}
			{% if pages.number == i %}
				<span style="color : white;" id="currentPage" src="{{i}}">{{ i }}  </span>
			{% else %}
				<span style="cursor:pointer;color:#333" src="{{i}}" class="paginationBt">{{ i }}  </span>
			{% endif %}
		{% endfor %}
	</div>
</div>
